// vue.config.js
// 是否是生产环境或者开发环境
const IS_PROD = ['production', 'prod'].includes(process.env.NODE_ENV);
// 引入 path
const path = require('path');
// 设置resolve环境
const resolve = (dir) => path.join(__dirname, dir);
// gzip压缩
const CompressionWebpackPlugin = require('compression-webpack-plugin');
// 代码压缩 delete config
const os = require('os');

module.exports = {
    // 公共路径
    publicPath: IS_PROD ? './' : '/',
    // 指定生成的 index.html 的输出路径 相对于outputDir
    indexPath: 'index.html',
    // 'dist', 生产环境构建文件的目录
    outputDir: 'dist',
    // 相对于outputDir的静态资源(js、css、img、fonts)目录
    assetsDir: 'static',
    // 是否在开发环境下通过 eslint-loader 在每次保存时 lint 代码
    lintOnSave: false,
    // 是否使用包含运行时编译器的 Vue 构建版本。设置为 true 后你就可以在 Vue 组件中使用 template 选项了
    runtimeCompiler: true,
    // 生产环境的 source map
    productionSourceMap: !IS_PROD,
    // 是否为 Babel 或 TypeScript 使用 thread-loader。该选项在系统的 CPU 有多于一个内核时自动启用，仅作用于生产构建。
    parallel: os.cpus().length > 1,
    chainWebpack: (config) => {
    // 添加bundle分析
    // config
    // .plugin('webpack-bundle-analyzer')
    // .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
    // 修复热加载
        config.resolve.symlinks(true);
        // 压缩代码
        config.optimization.minimize(true);
        // 添加别名
        config.resolve.alias
            .set('@', resolve('src'));

        // 分割代码
        config.optimization.splitChunks({
            chunks: 'all',
        });

        // 处理swf格式文件
        config.module
            .rule('swf')
            .test(/\.swf$/)
            .use('url-loader')
            .loader('url-loader')
            .options({
                limit: 10000,
            });
        // svg图片
        config.module
            .rule('svg')
            .exclude.add(resolve('src/icons'))
            .end();
        config.module
            .rule('icons')
            .test(/\.svg$/)
            .include.add(resolve('src/icons'))
            .end()
            .use('svg-sprite-loader')
            .loader('svg-sprite-loader')
            .options({
                symbolId: 'icon-[name]',
            })
            .end();
    },
    //
    configureWebpack: (config) => {
    // 生产环境相关配置
        if (IS_PROD) {
            // 代码压缩

            // gzip压缩
            const productionGzipExtensions = ['html', 'js', 'css'];
            config.plugins.push(
                new CompressionWebpackPlugin({
                    // filename: '[path].gz[query]',
                    algorithm: 'gzip',
                    test: new RegExp(
                        `\\.(${productionGzipExtensions.join('|')})$`,
                    ),
                    threshold: 10240, // 只有大小大于该值的资源会被处理 10240
                    minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
                    deleteOriginalAssets: false, // 删除原文件
                    exclude: /URL_CONF/,
                }),
            );

            //
        }

        // performace 警告
        config.performance = {
            hints: 'warning',
            // 入口起点的最大体积 整数类型（以字节为单位）
            maxEntrypointSize: 50000000,
            // 生成文件的最大体积 整数类型（以字节为单位 300k）
            maxAssetSize: 30000000,
            // 只给出 js 文件的性能提示
            assetFilter(assetFilename) {
                return assetFilename.endsWith('.js');
            },
        };
    },
    // css
    css: {
    // 生产环境下是 true，开发环境下是 false 是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)
        extract: IS_PROD,
        // 可以去掉文件名中的 .module
        requireModuleExtension: true,
        // 开启 CSS source maps?
        sourceMap: false,
        // CSS 相关的 loader 传递选项
        loaderOptions: {
            css: {

            },
            scss: {
                prependData: '@import "@/common/styles/common.scss";',
            },
        },
    },
    //
    devServer: {
        host: '0.0.0.0',
        port: 2500, // 端口号
        https: true, // https:{type:Boolean}
        open: false, // 配置自动启动浏览器
        // hotOnly: true, // 热更新
        hot: true,
        compress: true, // 开启代码压缩,

        // 安装了 wepackserver 开启自动刷新浏览器
        disableHostCheck: true, // webpack4.0 开启热更新
        proxy: {
            '/local': {
                target: 'https://172.17.11.59:1111/',
                // 允许跨域
                changeOrigin: true,
                ws: true,
                pathRewrite: {
                    '^/local': '',
                },
            },
        },
    },

};
